/* @flow */
'use strict';

var React = require('react-native');

var {
  StyleSheet,
  View,
  Text,
  DatePickerIOS,
} = React;

var DatePickerIOSView = React.createClass({

  getInitialState: function() {

    return {
      datetime: new Date(),
    };

  },

  onDateChange_:function(date){
  	this.setState({
  		datetime:date
  	});
  },

  render: function() {
    return (

    	<View style={styles.contentViewStyle}>
    	  <Text>{
    	  	this.state.datetime.toLocaleDateString() +
            ' ' +
            this.state.datetime.toLocaleTimeString()
            }
    	  </Text>
	      <DatePickerIOS
	        date={this.state.datetime}
	        minuteInterval={1}
	        mode={'datetime'}
	        onDateChange={this.onDateChange_}
	     	/>
     	</View>
    );
  }
});


var styles = StyleSheet.create({

	contentViewStyle:{
		padding:20,
		flex:1,
		justifyContent: 'center',
		alignItems: 'center', 
	},

	textStyle:{
		alignItems: 'center', 
	}

});


module.exports = DatePickerIOSView;
